import React, { useEffect, useState } from "react";
import { Input, Dropdown } from "antd";
import { Popup, Space } from "antd-mobile";
import { DownOutlined, SmileOutlined } from "@ant-design/icons";
import { Toast, NavBar, Cell } from "react-vant";
import { MoreOutlined } from "@ant-design/icons";
import { useNavigate } from "react-router-dom";
import axios from "../../axios";
const { TextArea } = Input;
export default function () {
  const [visible1, setVisible1] = useState(false);
  const navigate = useNavigate();

  const [inp, setinpt] = useState("");
  const [text, settext] = useState("");

  const items = [
    {
      key: "1",
      label: (
        <a
          target="_blank"
          rel="noopener noreferrer"
          href="https://www.antgroup.com"
        >
          1st menu item
        </a>
      ),
    },
  ];
  return (
    <div>
      <NavBar
        title="发布"
        leftText=""
        rightText={<MoreOutlined style={{ fontSize: "20px" }} />}
        onClickLeft={() => {
          navigate(-1);
        }}
        onClickRight={() => Toast("按钮")}
      />

      <Input
        placeholder="添加宝贝标题"
        allowClear
        value={inp}
        onChange={(e) => {
          setinpt(e.target.value);
        }}
      />
      <br />
      <br />
      <TextArea
        placeholder="描述型号、入手渠道、转手原因..."
        allowClear
        autoSize
        value={text}
        onChange={(e) => {
          settext(e.target.value);
        }}
      />
      <div
        style={{
          background: "#eee",
          // border:'1px solid #000',
          width: "100px",
          height: "100px",
          fontSize: "58px",
          textAlign: "center",
          lineHeight: "100px",
          color: "#999",
          position: "absolute",
          top: "150px",
          left: "10px",
        }}
        onClick={() => {
          setVisible1(true);
        }}
      >
        +
      </div>
      <div
        style={{
          position: "absolute",
          width: "100px",
          color: "#000",
          top: "500px",
          left: "10px",
        }}
      >
        <Dropdown
          menu={{
            items,
          }}
        >
          <a onClick={(e) => e.preventDefault()}>
            <Space>
              书本状况
              <DownOutlined />
            </Space>
          </a>
        </Dropdown>
      </div>

      <div
        style={{
          position: "absolute",
          width: "100px",
          color: "#000",
          top: "520px",
          left: "10px",
        }}
      >
        <Dropdown
          menu={{
            items,
          }}
        >
          <a onClick={(e) => e.preventDefault()}>
            <Space>
              价格
              <DownOutlined />
            </Space>
          </a>
        </Dropdown>
      </div>

      <div
        style={{
          position: "absolute",
          width: "100px",
          color: "#000",
          top: "540px",
          left: "10px",
        }}
      >
        <Dropdown
          menu={{
            items,
          }}
        >
          <a onClick={(e) => e.preventDefault()}>
            <Space>
              书名及ISBN
              <DownOutlined />
            </Space>
          </a>
        </Dropdown>
      </div>
    </div>
  );
}
